<template>
  <div class="mod-config">
    <basic-container>
      <navigationZhuanX :sign="{a:true,b:false,c:false,d:false,e:false}"></navigationZhuanX>
      <div v-if="showZhong==1" class="boxsty zhiBiao">
        <div  :height="searchheight" >
                <span style="float:right;margin-top: -30px;cursor: pointer;" @click="searchchangeadvanced">{{ searchadvanced ? "查询条件收起" : "查询条件展开" }}
                <i :class="searchadvanced ? 'el-icon-arrow-up' : 'el-icon-arrow-down'" /> </span>
          <div  v-show="searchadvanced" >
            <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"  class="form-inline">
              <el-form-item label="工作名称">
                <el-input v-model="dataForm.workName" placeholder="工作名称" :clearable="true"></el-input>
              </el-form-item>
              <el-form-item label="姓名">
                <el-input v-model="dataForm.cyryname" placeholder="姓名" :clearable="true"></el-input>
              </el-form-item>
              <el-form-item label="职务">
                <el-input v-model="dataForm.cyrydepartname" placeholder="职务" :clearable="true"></el-input>
              </el-form-item>
              <el-form-item label="结束时间">
                <el-date-picker
                  v-model="dataForm.endDate"
                  type="date"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item>
                <el-button icon="el-icon-search" type="primary" class="marginLeft"
                           @click="getDataList(1)">检索
                </el-button>
              </el-form-item>
            </el-form>
          </div>
        </div>
        <div class="mt10" style="overflow:hidden">
          <div style="float:right">
            <!--                    <el-button type="primary">批量提交</el-button>-->
            <!--                    <el-button type="primary">导入</el-button>-->
            <!--                    <el-button type="primary">导出</el-button>-->
            <el-button type="primary" @click="addOrUpdateHandle()">新增</el-button>
          </div>
        </div>
        <el-table
          style="width: 100%;margin-top:20px"
          :data="dataList"
          border
          v-loading="dataListLoading">
          <el-table-column type="selection" width="55" header-align="center" align="center"></el-table-column>
          <el-table-column type="index" width="80" header-align="center" align="center" label="序号"></el-table-column>
          <el-table-column
            prop="workName"
            header-align="center"
            align="center"
            min-width="100"
            label="工作名称">
          </el-table-column>
          <el-table-column
            prop="participantsCount"
            header-align="center"
            align="center"
            min-width="120"
            label="参与人数量">
            <template slot-scope="scope">
              <span style="cursor: pointer;" @click="checkPerson(scope.row,'cyr')">{{scope.row.participantsCount}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="scorerCount"
            header-align="center"
            align="center"
            min-width="120"
            label="打分人数量">
            <template slot-scope="scope">
              <span style="cursor: pointer;" @click="checkPerson(scope.row,'dfr')">{{scope.row.scorerCount}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="reviewerCount"
            header-align="center"
            align="center"
            min-width="120"
            label="审核人数量">
            <template slot-scope="scope">
              <span style="cursor: pointer;" @click="checkPerson(scope.row,'shr')">{{scope.row.reviewerCount}}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="endDate"
            header-align="center"
            align="center"
            min-width="100"
            label="结束时间">
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            width="350"
            fixed="right"
            label="操作">
            <template slot-scope="scope">
              <el-button type="primary" plain size="small"
                         @click="addOrUpdateHandle(scope.row)">查看编辑
              </el-button>
              <el-button type="primary" plain size="small" @click="shenH(scope.row)"
              >审核关系
              </el-button>
              <el-button type="primary" plain size="small" @click="pingJ(scope.row)"
              >评价关系
              </el-button>

            </template>
          </el-table-column>
        </el-table>
        <div class="avue-crud__pagination">
          <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
                         :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" background
                         layout="total, sizes, prev, pager, next, jumper">
          </el-pagination>
        </div>
      </div>
      <el-dialog :title="elTitle" :close-on-click-modal="false" :visible.sync="visible" width="30vw" top="8vh">
        <el-form :model="form" label-width="120px">
          <el-form-item label="工作名称">
            <el-input v-model="form.name" placeholder="工作名称"></el-input>
          </el-form-item>
          <el-form-item label="结束时间">
            <el-date-picker
              v-model="form.value1"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="工作目标/成效">
            <el-input type="textarea" v-model="form.name" placeholder="工作目标/成效"></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="visible = false">确定</el-button>
                <el-button type="primary" plain @click="visible = false">返回</el-button>
            </span>
      </el-dialog>
      <!--审核关系-->
      <zxshForm v-if="showZhong==2" ref="zxshform" :zxshformref='zxshformref' v-on:zxpjC='zxpjC'></zxshForm>
      <!--评价关系-->
      <zxpjForm  ref="pingjia"  v-if="showZhong==3"v-on:zxpjC='zxpjC' :zxid="zxid"></zxpjForm>
      <!--创建详情-->
      <zxxqForm v-if="showZhong==4" v-on:zxpjC='zxpjC'></zxxqForm>
      <!-- 弹窗, 新增 / 修改 -->
      <zxgzxzForm v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"  @refreash="refreashdata" @closeDialog="closeDialog"></zxgzxzForm>
      <personForm ref="person" :personForm='personForm'></personForm>
      <UserCommonSelect v-if="usercomment" ref="usercomment" @submitfy="submitfy"></UserCommonSelect>
    </basic-container>
  </div>
</template>

<script>
import UserCommonSelect from '@/views/hetongrenwu/components/usercomment-select'
import {fetchList,saveAllInfo} from '@/api/hetongrenwu/zhuanxianggongzuo/zxgzchuangjian'
import zxgzxzForm from '@/views/hetongrenwu/zhuanxianggongzuo/zhuanxianggzcj/zxgzcj/zxgzxinzeng-form'
import zxxqForm from  '@/views/hetongrenwu/zhuanxianggongzuo/zhuanxianggzcj/zxgzcj/zxxq-form'
import zxpjForm from  '@/views/hetongrenwu/zhuanxianggongzuo/zhuanxianggzcj/zxgzcj/zxpj-form'
import zxshForm from  '@/views/hetongrenwu/zhuanxianggongzuo/zhuanxianggzcj/zxgzcj/zxsh-form'
import personForm from  '@/views/hetongrenwu/zhuanxianggongzuo/zhuanxianggzcj/zxgzcj/person-form'
import {getCyr, getShr,saveCyrBycount,saveShrBycount,getZxpfList,savePfBycount} from '@/api/hetongrenwu/zhuanxianggongzuo/zxgzchuangjian'
export default {
  components:{
    zxgzxzForm,
    zxxqForm,
    zxpjForm,
    zxshForm,
    personForm,
    UserCommonSelect
  },
  data(){
    return{
      showZhong:1,
      dataForm:{},
      dataList:[{scorerCount:"1"}],
      dataListLoading:false,
      addOrUpdateVisible: false,
      visible:false,
      elTitle:"新增",
      form:{},
      searchadvanced: true,
      searchheight: '0',
      personForm:{},
      zxshformref:{},
      usercomment: false,
      cyrdataList:[],
      shrdataList:[],
      dfrdataList:[],
      rowzxid:0,
      zxid:Number
    }
  },
  watch:{
    radio(value){
      if(value){
        this.getDataList();
      }
    }
  },
  created() {
    this.getDataList()
  },
  methods:{
    searchchangeadvanced() {
      this.searchadvanced = !this.searchadvanced;
      if(this.searchadvanced){
        this.searchheight= 'auto'
      }
    },
    refreashdata(data){
      if(data==1){
        this.getDataList();
      }
    },
    //新增与编辑
    addOrUpdateHandle(obj){
      this.addOrUpdateVisible = true

      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(obj)
      })
    },
    //打开人员
    checkPerson(row,type){
      this.rowzxid=row.id;
      if(type=='cyr'){
        getCyr(row.id).then(res => {
          this.cyrdataList = res.data.data;
          this.usercomment = true;
          this.jsonData = JSON.stringify(this.cyrdataList)
         //console.log(JSON.stringify(this.cyrdataList)+"===---json")
          this.$nextTick(() => {
            this.$refs.usercomment.init(row.id, "cyr", this.jsonData);
          });
        })
      }
       if(type=='shr'){
        getShr(row.id).then(res => {
          this.shrdataList = res.data.data;
          this.usercomment = true;
          this.jsonData = JSON.stringify(this.shrdataList)
         //console.log(JSON.stringify(this.shrdataList)+"===---json")
          this.$nextTick(() => {
            this.$refs.usercomment.init(row.id, "shr", this.jsonData);
          });
        })
      }
       if(type=='dfr'){
        getZxpfList(row.id).then(res => {
          this.dfrdataList = res.data.data;
          this.usercomment = true;
          this.jsonData = JSON.stringify(this.dfrdataList)
         //console.log(JSON.stringify(this.dfrdataList)+"===---json")
          this.$nextTick(() => {
            this.$refs.usercomment.init(row.id, "dfr", this.jsonData);
          });
        })
      }
    },
    submitfy(data) {

      if (data.type == 'cyr') {
       //console.log(JSON.stringify(data) + "2222----");
        saveCyrBycount({"zxid": this.rowzxid, "jsondata": data.tableDataUser}).then(res => {
          this.$message({
            type: 'success',
            message: '提交成功!'
          });
          this.getDataList();
        })
        // this.cyrdataList = data.tableDataUser;
      }
     if (data.type == 'shr') {
        saveShrBycount({"zxid": this.rowzxid, "jsondata": data.tableDataUser}).then(res => {
          this.$message({
            type: 'success',
            message: '提交成功!'
          });
          this.getDataList();
        })
        // this.cyrdataList = data.tableDataUser;
      }
       if (data.type == 'dfr') {
        savePfBycount({"zxid": this.rowzxid, "jsondata": data.tableDataUser}).then(res => {
          this.$message({
            type: 'success',
            message: '提交成功!'
          });
          this.getDataList();
        })
        // this.cyrdataList = data.tableDataUser;
      }
        // this.$nextTick(()=>{
        //    this.getDataList();
        // })
    },
    xiangQ(){
      this.showZhong=4
    },
    //评价关系
    pingJ(row){
      saveAllInfo(row).then(res=>{
        this.showZhong=3
        this.zxid = row.id
      });
    },
    //审核关系
    shenH(obj){
      this.showZhong=2
      this.zxshformref={
        rowid:obj.id,
      }
      this.$nextTick(()=>{
        this.$refs.zxshform.init(obj)
      })
    },
    //子集返回
    zxpjC(zxpjC){
      this.showZhong=1
    },
    // 获取数据列表
    getDataList() {
      this.dataListLoading = true
      fetchList(Object.assign({
        type:this.radio,
        cyrydepartname:this.dataForm.cyrydepartname,
        cyryname:this.dataForm.cyryname,
        workName:this.dataForm.workName,
        participantsCount:this.dataForm.participantsCount,
        scorerCount:this.dataForm.scorerCount,
        reviewerCount:this.dataForm.reviewerCount,
        endDate:this.dataForm.endDate,
        workResult:this.dataForm.workResult,
        current: this.pageIndex,
        size: this.pageSize
      })).then(response => {
       //console.log(response)
        this.dataList = response.data.data.records
        this.totalPage = response.data.data.total
      })
      this.dataListLoading = false
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDataList()
    },
    closeDialog(){
      this.addOrUpdateVisible = false;
    }
  }
}
</script>

<style>

</style>
